<!-- 首页-商户列表组件 -->
<template name="shoplistcom">
	<view class="shoplist">
		<view class="conList_item" @click="navshopDetail(item.suid)" v-for="(item,index) in shoplistArr" :key="index" >
			<view class="conList_title">
				<view class="title_name">
					<text>{{item.shop_name}}</text>
					<text v-if="item.status" class="title_size" :class="statusColor[item.status]">{{item.statusText}}</text>
				</view>
				<view class="title_id">
					<text>商户UID:&nbsp&nbsp{{item.uid}}</text>
					<text>门店ID:&nbsp&nbsp{{item.suid}}</text>
				</view>
			</view>
			<view class="conList_detail">
				<view class="conList_info" v-if="item.realname">
					<view class="info_title">BD</view>
					<view class="info_Text">{{item.realname}} AID{{item.aid}}</view>
				</view>
				<view class="conList_info">
					<view class="info_title">门店地址</view>
					<view class="info_Text">{{item.address}}</view>
				</view>
				<view class="conList_info" v-if="item.bang.isWaimai||item.bang.isPay">
					<view class="info_tag" v-if="item.bang.isPay">外卖未绑定</view>
					<view class="info_tag" v-if="item.bang.isWaimai">支付未绑定</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "shoplistcom",
		data() {
			return {
				statusColor:{
					'1':'bluefont',//审核通过
					'2':'orangefont',//审核中
					'3':'redfont', //审核失败
					'4':'greenfont' //未认证
				}
			};
		},
		methods:{
			navshopDetail:function(suid){
				uni.navigateTo({
					url: '../../view/shopdetail/shopdetail?suid='+suid+'&type='+this.shoptype,
					success:function(res){
						console.log(res)
					},
					fail:function(res){
						console.log(res)
					}
				})
			}
		},
		props: {
			shoplistArr:"",
			shoptype:""
		}
	}
</script>

<style lang="scss" scoped>
	.shoplist{
		.conList_item{
			margin: 20rpx 30rpx 20rpx 30rpx;
			padding: 30rpx;
			box-shadow: 0 0rpx 30rpx rgba(0, 0, 0, 0.06);
			border-radius: $uni-border-radius-base;
			.conList_title{
				border-bottom: 1rpx #E5E5E5 solid;
				.title_name{
					color: $uni-text-color;
					font-size: $uni-font-size-lg;
					font-weight: bold;
					.title_size{
						float: right;
						font-weight: normal;
						font-size: $uni-font-size-base;
						&.red{
							color: #F94441;
						}
						&.blue{
							color: #007AFF;
						}
					}
				}
			}
			.title_id{
				color: $uni-text-color-grey;
				font-size: $uni-font-size-base;
				padding: 10rpx 0 20rpx 0;
				text{
					margin-right: 20rpx;
				}
			}
			.conList_detail{
				padding-top: 15rpx;
				.conList_info{
					padding: 15rpx 0;
					font-size: $uni-font-size-lg;
					display: flex;
					justify-content: flex-start;
					.info_title{
						color: $uni-text-color-grey;
						width: 25%;
					}
					.info_Text{
						width: 75%;
					}
					.info_tag{
						width: 145rpx;
						height: 40rpx;
						line-height: 40rpx;
						text-align: center;
						font-size: $uni-font-size-sm;
						background-color: rgba($color: #007AFF, $alpha: 0.2);
						color: #007AFF;
						border-radius: $uni-border-radius-sm;
						margin-right: 20rpx;
					}
				}
			}
		}
	}
</style>
